<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<% pageContext.setAttribute("ctp",request.getContextPath()); %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
	<title>人事管理系统 ——部门管理</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="pragma" content="no-cache" />
	<meta http-equiv="cache-control" content="no-cache" />
	<meta http-equiv="expires" content="0" />
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3" />
	<meta http-equiv="description" content="This is my page" />
	<link href="${ctp}/css/css.css" type="text/css" rel="stylesheet" />
	<link rel="stylesheet" type="text/css" href="${ctp}/js/ligerUI/skins/Aqua/css/ligerui-dialog.css"/>
	<link href="${ctp}/js/ligerUI/skins/ligerui-icons.css" rel="stylesheet" type="text/css" />
	<script type="text/javascript" src="${ctp}/js/jquery-1.11.0.js"></script>
	<script type="text/javascript" src="${ctp}/js/jquery-migrate-1.2.1.js"></script>
	<script src="${ctp}/js/ligerUI/js/core/base.js" type="text/javascript"></script>
	<script src="${ctp}/js/ligerUI/js/plugins/ligerDrag.js" type="text/javascript"></script>
	<script src="${ctp}/js/ligerUI/js/plugins/ligerDialog.js" type="text/javascript"></script>
	<script src="${ctp}/js/ligerUI/js/plugins/ligerResizable.js" type="text/javascript"></script>
	<script src="${ctp}/js/jquery.pagination.min.js" type="text/javascript"></script>
	<link href="${ctp}/css/pager.css" type="text/css" rel="stylesheet" />
	<link rel="stylesheet" href="${ctp}/css/jquery.pagination.css" />
	<script type="text/javascript">
		$(function(){
			/** 获取上一次选中的部门数据 */
			var boxs  = $("input[type='checkbox'][id^='box_']");

			/** 给全选按钮绑定点击事件  */
			$("#checkAll").click(function(){
				// this是checkAll  this.checked是true
				// 所有数据行的选中状态与全选的状态一致
				boxs.attr("checked",this.checked);
			})

			/** 给数据行绑定鼠标覆盖以及鼠标移开事件  */
			$("tr[id^='data_']").hover(function(){
				$(this).css("backgroundColor","#eeccff");
			},function(){
				$(this).css("backgroundColor","#ffffff");
			})


			/** 删除员工绑定点击事件 */
			$("#delete").click(function(){
				/** 获取到用户选中的复选框  */
				var checkedBoxs = boxs.filter(":checked");
				if(checkedBoxs.length < 1){
					$.ligerDialog.error("请选择一个需要删除的部门！");
				}else{
					/** 得到用户选中的所有的需要删除的ids */
					var ids = checkedBoxs.map(function(){
						return this.value;
					})

					$.ligerDialog.confirm("确认要删除吗?","删除部门",function(r){
						if(r){
							// alert("删除："+ids.get());
							// 发送请求
							window.location = "${ctp}/dept/deletedept?ids=" + ids.get();
						}
					});
				}
			})
		})
	</script>
</head>
<body>

<!-- 导航 -->
<table width="100%" border="0" cellpadding="0" cellspacing="0">
	<tr><td height="10"></td></tr>
	<tr>
		<td width="15" height="32"><img src="${ctp}/images/main_locleft.gif" width="15" height="32"></td>
		<td class="main_locbg font2"><img src="${ctp}/images/pointer.gif">&nbsp;&nbsp;&nbsp;当前位置：部门管理 &gt; 部门查询</td>
		<td width="15" height="32"><img src="${ctp}/images/main_locright.gif" width="15" height="32"></td>
	</tr>
</table>

<table width="100%" height="90%" border="0" cellpadding="5" cellspacing="0" class="main_tabbor">
	<!-- 查询区  -->
	<tr valign="top">
		<td height="30">
			<table width="100%" border="0" cellpadding="0" cellspacing="10" class="main_tab">
				<tr>
					<td class="fftd">

						<table width="100%" border="0" cellpadding="0" cellspacing="0">
							<tr>
								<form action="">
									<td class="font3">
										部门名称：<input type="text" name="name" value="${deptInf.name}">
										<input type="submit" value="搜索"/>
										<input id="delete" type="button" value="删除"/>
									</td>
								</form>
							</tr>
						</table>

					</td>
				</tr>
			</table>
		</td>
	</tr>

	<!-- 数据展示区 -->
	<tr valign="top">
		<td height="20">
			<table width="100%" border="1" cellpadding="5" cellspacing="0" style="border:#c2c6cc 1px solid; border-collapse:collapse;">
				<tbody>
				<tr class="main_trbg_tit" align="center">
					<td><input type="checkbox" name="checkAll" id="checkAll"></td>
					<td>部门名称</td>
					<td>详细信息</td>

					<td align="center">操作</td>

				</tr>

				<%--				<tr id="data_0" align="center" class="main_trbg" style="background-color: rgb(255, 255, 255);">--%>
				<%--					<td><input type="checkbox" id="box_0" value="1"></td>--%>
				<%--					 <td>技术部</td>--%>
				<%--					  <td>技术部</td>--%>

				<%--					 <td align="center" width="40px;"><a href="showUpdateDept.html">--%>
				<%--							<img title="修改" src="${ctp}/images/update.gif"></a>--%>
				<%--					  </td>--%>

				<%--				</tr>--%>

				<%--				<tr id="data_1" align="center" class="main_trbg" style="background-color: rgb(238, 204, 255);">--%>
				<%--					<td><input type="checkbox" id="box_1" value="2"></td>--%>
				<%--					 <td>运营部</td>--%>
				<%--					  <td>运营部</td>--%>

				<%--					 <td align="center" width="40px;"><a href="showUpdateDept.html">--%>
				<%--							<img title="修改" src="${ctp}/images/update.gif"></a>--%>
				<%--					  </td>--%>

				<%--				</tr>--%>

				<%--				<tr id="data_2" align="center" class="main_trbg">--%>
				<%--					<td><input type="checkbox" id="box_2" value="3"></td>--%>
				<%--					 <td>财务部</td>--%>
				<%--					  <td>财务部</td>--%>

				<%--					 <td align="center" width="40px;"><a href="showUpdateDept.html">--%>
				<%--							<img title="修改" src="${ctp}/images/update.gif"></a>--%>
				<%--					  </td>--%>

				<%--				</tr>--%>

				<%--				<tr id="data_3" align="center" class="main_trbg">--%>
				<%--					<td><input type="checkbox" id="box_3" value="5"></td>--%>
				<%--					 <td>总公办</td>--%>
				<%--					  <td>总公办</td>--%>

				<%--					 <td align="center" width="40px;"><a href="showUpdateDept.html">--%>
				<%--							<img title="修改" src="${ctp}/images/update.gif"></a>--%>
				<%--					  </td>--%>

				<%--				</tr>--%>

				<c:forEach items="${deptInfPageInfo.list}" var="dept">
					<tr id="data_${dept.id}" align="center" class="main_trbg" style="background-color: rgb(238, 204, 255);">
						<td><input type="checkbox" id="box_${dept.id}" value="${dept.id}" name="check"></td>
						<td>${dept.name}</td>
						<td>${dept.remark}</td>

						<td align="center" width="40px;"><a href="${ctp}/dept/toUpdatedept?id=${dept.id}">
							<img title="修改" src="${ctp}/images/update.gif"></a>
						</td>
					</tr>
				</c:forEach>


				</tbody>
			</table>
		</td>
	</tr>
	<!-- 分页标签 -->
	<tr valign="top"><td align="center" class="font3">
		<form action="${ctp}/dept/selectdept">
			<table width="100%" align="center" style="font-size:13px;" class="digg">
				<tbody>
				<form action="${ctp}/dept/selectdept">
					<tr>
						<td style="COLOR: #0061de; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; TEXT-DECORATION: none">
							<div id="M-box2">

							</div>
							<%--						<span class="disabled">上一页</span>--%>
							<%--						<span class="current">1</span>--%>
							<%--						<a href="#">2</a>--%>
							<%--						<a href="#">下一页</a>&nbsp;--%>

							跳转到&nbsp;&nbsp;
							<input style="text-align: center;BORDER-RIGHT: #aaaadd 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #aaaadd 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #aaaadd 1px solid; COLOR: #000099; PADDING-TOP: 2px; BORDER-BOTTOM: #aaaadd 1px solid; TEXT-DECORATION: none" type="text" size="2" id="pager_jump_page_size" name="page">&nbsp;
							<input type="hidden" name="name" value="${deptInf.name}">
							<input type="submit" style="text-align: center;BORDER-RIGHT: #dedfde 1px solid; PADDING-RIGHT: 6px; BACKGROUND-POSITION: 50% bottom; BORDER-TOP: #dedfde 1px solid; PADDING-LEFT: 6px; PADDING-BOTTOM: 2px; BORDER-LEFT: #dedfde 1px solid; COLOR: #0061de; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; BORDER-BOTTOM: #dedfde 1px solid; TEXT-DECORATION: none" value="确定" id="pager_jump_btn">
						</td>
					</tr>
				</form>
				<tr align="center">
					<td style="font-size:13px;"></td>
				</tr>
				<tr>
					<td style="COLOR: #0061de; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; TEXT-DECORATION: none">
						总共<font color="red">${deptInfPageInfo.total}</font>条记录，当前显示${deptInfPageInfo.startRow}-${deptInfPageInfo.endRow}条记录。
					</td>
				</tr>
				</tbody>
			</table>
		</form>
	</td>
	</tr>
</table>
<div style="height:10px;"></div>
<script>
	$(function (){
		var pageNum = ${deptInfPageInfo.pageNum};
		var pages = ${deptInfPageInfo.pages};

		$("#M-box2").pagination({

			currentPage: pageNum,
			totalPage: pages,
			num_edge_entries:4,
			num_display_entries:10,
			homePageText:"首页",
			prevPageText:"上一页",
			nextPageText:"下一页",
			endPageText:"尾页",
			callback: function (current) {
				location.href = "${ctp}/dept/selectdept?page="+current+"&name=${deptInf.name}";
			}
		});

		$(function(){
			$("#checkAll").click(function(){
				$("input[name='check']").prop("checked",this.checked);
			});
		})
	});
</script>
</body>
</html>